/*
 * @Author: your name
 * @Date: 2020-10-30 15:09:40
 * @LastEditTime: 2020-11-12 14:03:40
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: /crowd-funding/src/components/pages/HomePage/index.js
 */
import React, { useEffect, useRef, useState } from 'react'
import Header from '../header/index' // 头部背景
import ProgressRemind from '../ProgressRemind/index' // 进度提醒
import PriceChoose from '../PriceChoose/index' // 档位选择
import Store from '../component/store/index'
import PriceModel from '../component/PriceModel'

import './index.scss'
import { reportPV } from '@/utils/ping'
import { projectId, source } from '@/utils/constants'
import { useDispatch, useSelector } from 'react-redux'
import { get } from 'lodash'
import { customNavigation, getNavigationHeight, isJDAPP, jdVersionGTA916 } from '@/utils/navigation'
import { isProduction } from '@/utils/utils'

export default (props) => {
	const contentRef = useRef()
	const dispatch = useDispatch()
	const homeData = useSelector((state) => state.homeData)
	const dialogData = useSelector((state) => state.dialogData)
	const { isOpen = false } = dialogData
	const storyPageData = get(homeData, 'storyPageData', {})
	const projectStoryNewDto = get(storyPageData, 'projectStoryNewDto', {})
	const buttonStatus = get(projectStoryNewDto, 'buttonStatus', 0)
	const projectAdvertChildInfoVos = get(storyPageData, 'projectStoryNewDto.storyDto', [])
	useEffect(() => {
		if (buttonStatus !== 0) {
			reportPV({ projectId, buttonStatus, source })
		}
		return () => {}
	}, [projectId, buttonStatus])

	const [navHeight, setNavHeight] = useState(0)
	const [statusHeight, setStatusHeight] = useState(0)
	const [isSetNavFlag, setIsSetNavFlag] = useState(false)
	useEffect(() => {
		customNavigation().then((res) => {
			if (res.status === '0') {
				setIsSetNavFlag(res.data.naviIsHidden)
			}
		})
		getNavigationHeight().then((res) => {
			setNavHeight(res.navigationHeight)
			setStatusHeight(res.statusBarHeight)
		})
		// 因为ios会在页面内存比较高的时候 把不活跃的页面销毁，然后webview那边会重新刷新一次你的页面，这时候你调接口获取到的信息是不对的，所以回到你页面的时候，重新发一次协议请求
		setTimeout(() => {
			if (!isJDAPP) return
			window.webviewVisible = (rawVisible) => {
				if (rawVisible) {
					customNavigation().then((res) => {
						if (res.status === '0') {
							setIsSetNavFlag(res.data.naviIsHidden)
						}
					})
					getNavigationHeight().then((res) => {
						setNavHeight(res.navigationHeight)
						setStatusHeight(res.statusBarHeight)
					})
				}
			}
		}, 1000)
		return () => {}
	}, [projectId])
	return (
		<div
			className="home-page"
			ref={contentRef}
			style={{
				'-webkit-overflow-scrolling': isOpen ? 'auto' : 'touch',
				overflowY: isOpen ? 'hidden' : 'scroll',
			}}>
			{/* 头部背景 */}
			<Header
				contentRef={contentRef}
				isSetNavFlag={isSetNavFlag}
				statusHeight={statusHeight}
				navHeight={navHeight}
			/>
			{/* 背景层 */}
			<div className="background">
				{/* 背景大球 */}
				<div className="bg-max-circle" />
				{/* 背景中球 */}
				<div className="bg-middle-circle" />
				{/* 背景上小球 */}
				<div className="top-min-circle" />
				{/* 背景下小球 */}
				<div className="bottom-min-circle" />
			</div>
			{/* 打开扩散背景 */}
			<div className="open-bg"></div>
			<div className="header-bg">
				{/* 进度提醒 */}
				<ProgressRemind />
				{/* 档位选择 */}
				<PriceChoose />
			</div>
			{projectAdvertChildInfoVos.length > 0 ? <Store /> : null}
			{!isProduction() ? (
				<div
					className="delete-reminder"
					onClick={() => dispatch({ type: 'delete:reminder' })}>
					删除提醒
				</div>
			) : null}
			{isOpen ? <PriceModel /> : null}
		</div>
	)
}
